<template>
  <a-modal
    centered
    :title='title'
    :width='width'
    :visible='visible'
    @cancel='handleCancel'
    cancelText='关闭'>

    <a-descriptions :column='1' bordered>
      <a-descriptions-item style='width: 100px'>
        <template v-slot:label>
          <div style='min-width: 100px;max-width: 100px'>检查人</div>
        </template>
        {{ model.userName }}
      </a-descriptions-item>

      <a-descriptions-item label='检查类型'>
        {{ model.checkType_dictText }}
      </a-descriptions-item>
      <a-descriptions-item label='公寓'>
        {{ model.apartmentName }}
      </a-descriptions-item>

      <a-descriptions-item label='楼栋'>
        {{ model.buildName }}
      </a-descriptions-item>
      <a-descriptions-item label='楼层'>
        {{ model.floorName }}
      </a-descriptions-item>
      <a-descriptions-item label='房间'>
        {{ model.roomName }}
      </a-descriptions-item>
      <a-descriptions-item label='图片'>
        <template v-if='model.imageUrl'>
        <img width='200px' height='200px' :src='src' v-for='src of model.imageUrl.split(",")'>
        </template>
      </a-descriptions-item>
      <a-descriptions-item label='检查内容'>
        {{ model.remark }}
      </a-descriptions-item>
      <a-descriptions-item label='检查时间'>
        {{ model.createTime }}
      </a-descriptions-item>
    </a-descriptions>

    <template slot='footer'>
      <a-button key='back' @click='handleCancel'>
        关闭
      </a-button>
    </template>
    <preview-picture ref='previewPicture'></preview-picture>
  </a-modal>

</template>

<script>

export default {
  name: 'CameraDeviceModal',
  components: {},
  data() {
    return {
      title: '操作',
      width: 800,
      visible: false,
      model: {}
    }
  },
  methods: {
    open(record) {
      this.model = Object.assign({}, record)
      this.visible = true
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleCancel() {
      this.close()
    }
  }
}
</script>